<template>
  <div  class="page-real-content">
    <el-button  @click="addStation()" type="primary" style="" v-if="stationType==='insert'">新增岗位说明</el-button>
    <div v-else>
      <el-tabs v-model="activeName" @tab-click="handleDialogClick" >
        <el-tab-pane label="岗位说明书" name="1" >
          <el-form :inline="true"  label-position="right" label-width="120px" :model="station.baseInfo">
            <el-form-item label="岗位名称" prop="fileName">
              <el-input v-model="station.baseInfo.name" class="width220" disabled></el-input>
            </el-form-item>
            <el-form-item label="录入时间">
              <el-input v-model="station.baseInfo.stationDescCreateTime" disabled class="width220"></el-input>
            </el-form-item>
            <el-form-item label="岗位录入人">
              <el-input v-model="station.baseInfo.stationDescCreatorName" disabled class="width220"></el-input>
            </el-form-item>
          </el-form>
          <el-form  label-position="right" label-width="120px" :model="station.baseInfo"   ref="stationRef">
            <el-form-item label="岗位说明书" class="form-item-block">
              <div class="vueEditorBox">
                <VueUeditorWrap v-model="station.baseInfo.stationDesc" :config="config"></VueUeditorWrap>
              </div>
            </el-form-item>
            <el-form-item class="form-item-block">
              <el-button  @click="submitStation" type="primary">编 辑</el-button>
            </el-form-item>
          </el-form>
        </el-tab-pane>
        <el-tab-pane label="招聘描述" name="2"  >
          <el-form :inline="true"  label-position="right" label-width="120px" :model="station.baseInfo">
            <el-form-item label="录入时间">
              <el-input v-model="station.recruitment.recruitmentDescCreateTime" disabled class="width220"></el-input>
            </el-form-item>
            <el-form-item label="录入人">
              <el-input v-model="station.recruitment.recruitmentDescCreatorName" disabled class="width220"></el-input>
            </el-form-item>
          </el-form>
          <el-form  label-position="right" label-width="120px" :model="station.baseInfo"  ref="recruitmentRef">
            <el-form-item label="招聘描述" class="form-item-block">
              <div class="vueEditorBox">
                <VueUeditorWrap v-model="station.recruitment.recruitmentDesc" :config="config"></VueUeditorWrap>
              </div>
            </el-form-item>
            <el-form-item class="form-item-block">
              <el-button  @click="submitRecruitment" type="primary">编 辑</el-button>
            </el-form-item>
          </el-form>
        </el-tab-pane>
        <el-tab-pane label="简历筛选" name="3" >
          <el-button  @click="showResumeScreeningDailog('insert')" type="primary">新增</el-button>
          <el-table :data="resumeScreening.list" stripe border height="700px" class="user-table" style="width: 100%;" :header-cell-style="getRowClass">
          <el-table-column fixed type="index" label="*" sortable width="40"></el-table-column>
          <el-table-column prop="name" label="姓名"  sortable width="110" align="center"></el-table-column>
          <el-table-column prop="content" label="内容" sortable min-width="120">
            <template  slot-scope="scope">
              <div v-html="scope.row.content"></div>
            </template>
          </el-table-column>
          <el-table-column prop="creatorName" label="创建人"  sortable width="100"></el-table-column>
          <el-table-column prop="createTime" label="创建时间" sortable width="150"></el-table-column>
          <el-table-column   label="操作" sortable width="200">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="showResumeScreeningDailog('update',scope.row)">编辑</el-button>
              <el-button type="text" size="small" @click="showResumeScreeningDailog('imageUpload',scope.row)">图片上传</el-button>
              <el-button type="text" size="small" @click="showResumeScreeningDailog('enclosureUpload',scope.row)">附件上传</el-button>
            </template>
          </el-table-column>
        </el-table>
        </el-tab-pane>
        <el-tab-pane label="面试" name="4"  >
          <HrRecord :hid="orgId" recordType="1" ref="interviewRef"></HrRecord>
        </el-tab-pane>
        <el-tab-pane label="录取通知" name="5"  >
          <HrRecord :hid="orgId" recordType="2"  ref="offerRef"></HrRecord>
        </el-tab-pane>
        <el-tab-pane label="岗前培训与结果" name="6" >
          <HrRecord :hid="orgId" recordType="3"  ref="trainRef"></HrRecord>
        </el-tab-pane>
        <el-tab-pane label="试用期评价" name="7"  >
           <HrRecord :hid="orgId" recordType="4"  ref="evaluateRef"></HrRecord>
        </el-tab-pane>
      </el-tabs>
     </div>


    <!-- 简历筛选 -->
    <el-dialog :title="resumeScreening.dialog.title" width="800px" class="bodyNopaddingTop" :visible.sync="resumeScreening.dialog.isShow" :close-on-click-modal="false" v-dialogDrag>
      <div  v-if="resumeScreening.dialog.type==='imageUpload'">
        <div>
          <el-upload
            class="upload-demo"
            ref="uploadImage"
            :action="resumeScreening.imageUploadUrl"
            multiple
            :limit="1"
            :on-success="uploadSuccess">
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
          </el-upload>
        </div>
        <h3 class="dialog-plate-title"><span>上传图片列表</span></h3>
        <el-table :data="resumeScreening.imageUploadeList" stripe border height="700px" class="user-table" style="width: 100%;">
          <el-table-column fixed type="index" label="*" sortable width="40"></el-table-column>
          <el-table-column prop="path" label="图片"  sortable min-width="110" align="cover">
            <template slot-scope="scope">
                <el-image class="previewImage"
                  :src="scope.row.path"
                  :preview-src-list="resumeScreening.previewList" fit="fill">
                </el-image>
            </template>
          </el-table-column>
          <el-table-column prop="creatorName" label="上传人"  sortable width="100"></el-table-column>
          <el-table-column prop="createTime" label="上传时间" sortable width="150"></el-table-column>
          <el-table-column   label="操作" sortable width="100">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="deleteFile('img',scope.row)"><span class="sub-fn-color3">删除</span></el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <div  v-else-if="resumeScreening.dialog.type==='enclosureUpload'">
        <div>
          <el-upload
            class="upload-demo"
            ref="uploadEnclosure"
            :action="resumeScreening.enclosureUpload.url"
            multiple
            :limit="1"
            :data="resumeScreening.enclosureUpload.data"
            :on-success="enclosureUploadSuccess">
            <el-button size="small" type="primary">点击上传</el-button>
          </el-upload>
        </div>
        <h3 class="dialog-plate-title"><span>上传附件列表</span></h3>
        <el-table :data="resumeScreening.enclosureUpload.list" stripe border height="700px" class="user-table" style="width: 100%;">
          <el-table-column fixed type="index" label="*" sortable width="40"></el-table-column>
          <el-table-column prop="name" label="附件名称"  sortable min-width="110" align="cover"></el-table-column>
          <el-table-column prop="creatorName" label="上传人"  sortable width="100"></el-table-column>
          <el-table-column prop="createTime" label="上传时间" sortable width="150"></el-table-column>
          <el-table-column   label="操作" sortable width="100">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="downloadFile('enclosure',scope.row)"><span class="sub-fn-color2">下载</span></el-button>
              <el-button type="text" size="small" @click="deleteFile('enclosure',scope.row)"><span class="sub-fn-color3">删除</span></el-button>

            </template>
          </el-table-column>
        </el-table>
      </div>
      <el-form label-position="right" label-width="110px" :model="resumeScreening.dialog.formData" v-else>
        <el-form-item label="姓名">
          <el-input v-model="resumeScreening.dialog.formData.name"  class="width220"></el-input>
        </el-form-item>
        <el-form-item label="内容" class="form-item-block">
          <div class="vueEditorBox">
            <VueUeditorWrap v-model="resumeScreening.dialog.formData.content" :config="config"></VueUeditorWrap>
          </div>
        </el-form-item>
        <el-form-item label="创建人" v-if="resumeScreening.dialog.type==='update'">
          <el-input v-model="resumeScreening.dialog.formData.creatorName" disabled></el-input>
        </el-form-item>
        <el-form-item label="创建时间" v-if="resumeScreening.dialog.type==='update'">
          <el-input v-model="resumeScreening.dialog.formData.createTime" disabled></el-input>
        </el-form-item>
        <el-form-item class="form-item-block text-center">
          <el-button @click="submitResumeScreening" type="primary">确 定</el-button>
        </el-form-item>
      </el-form>

    </el-dialog>
  </div>
</template>
<script>
import humanResourcesApi from '@/axios/humanResourcesApi.js'
import baseApi from '@/axios/baseHttp.js'
import VueUeditorWrap from 'vue-ueditor-wrap'
import HrRecord from './components/hrRecord.vue'
export default {
  components:{
    VueUeditorWrap,
    HrRecord
  },
  data(){
    return {
      stationType:"insert",
      orgId:'',
      activeName:'1',
      station:{
        baseInfo:{},/**岗位说明 */
        recruitment:{},/**招聘描述 */
      },
      resumeScreening:{/**简历筛选 */
        list:[],
        imageUploadeList:[],/**图片上传列表 */
        enclosureUpload:{
          list:[],/**附件上传列表 */
          url:humanResourcesApi.getEnclosureUploadUrl(),/**附件上传url */
          data:{} /**附件上传data */
        },
        previewList:[],
        imageUploadUrl:baseApi.publicImgLoad(),/**图片上传url */
        dialog:{
          formData:{},
          isShow:false,
          title:'',
          type:''
        }
      },
      config: {
        autoHeightEnabled: false,
        initialFrameHeight: 500,
        initialFrameWidth: '100%',
        // 上传文件接口（这个地址是我为了方便各位体验文件上传功能搭建的临时接口，请勿在生产环境使用！！！）
        autoFloatEnabled: true,　　//是否工具栏可浮动
        initialContent:'请输入内容',   //初始化编辑器的内容,也可以通过textarea/script给值，看官网例子
        autoClearinitialContent:true, //是否自动清除编辑器初始内容，注意：如果focus属性设置为true,这个也为真，那么编辑器一上来就会触发导致初始化的内容看不到了
        BaseUrl: '',
        serverUrl:  "http://192.168.0.93:8889/mh/ueditor/config",
        UEDITOR_HOME_URL: 'static/ueditor/'
      },
    }
  },
  watch:{
    $route(){
      this.orgId = this.$route.query.orgId;
      this.activeName = "1";
      this.station={
        baseInfo:{},/**岗位说明 */
        recruitment:{}/**招聘描述 */
      };
      this.getStationDesc()
    },
  },
  computed:{
  },
  mounted(){
    this.orgId = this.$route.query.orgId;
    this.getStationDesc()
  },
  methods:{
    /**获取岗位说明 */
    getStationDesc(){
      let self = this;
      humanResourcesApi.getStationDescByMenuId(self.orgId).then(res=>{
        if(res.content){
          self.stationType ="update";
          res.content.stationDesc = res.content.stationDesc?res.content.stationDesc:"";
          self.station.baseInfo=res.content;
        }else{
           self.stationType ="insert";
        }
      })
    },
    /**获取 招聘描述*/
    getRecruitmentDesc(){
      let self = this;
      humanResourcesApi.getRecruitmentDescByMenuId(self.orgId).then(res=>{
        res.content.recruitmentDesc = res.content.recruitmentDesc ?res.content.recruitmentDesc :"";
        self.station.recruitment = res.content;
      })
    },
    handleDialogClick(tab,event){
      let self = this;
      switch(tab.name){
        case "1":
          self.getStationDesc();
          break;
        case "2":
          self.getRecruitmentDesc();
          break;
        case "3":
          self.getResumeScreeningList();
           break;
        case "4":
          self.$refs.interviewRef.getTableList();
          break;
        case "5":
          self.$refs.offerRef.getTableList();
          break;
        case "6":
          self.$refs.trainRef.getTableList();
          break;
        case "7":
          self.$refs.evaluateRef.getTableList();
          break;
      }
    },
    /** 新增人力资源岗位*/
    addStation(){
      let self = this;
      self.$confirm('是否新增此人力资源岗位说明？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          center: true
      }).then(() => {
          humanResourcesApi.addContent({id:self.orgId}).then(res=>{
              self.$message.success("新增成功");
              self.getStationDesc();
          })
      }).catch(() => {});
    },
    /**修改岗位说明 */
    submitStation(){
      let self = this;
      if(!self.station.baseInfo.stationDesc||self.station.baseInfo.stationDesc===''){
         self.$message.error("请输入岗位说明");
      }else{
        humanResourcesApi.updateStationDesc({
          id:self.orgId,
          stationDesc:self.station.baseInfo.stationDesc
        }).then(res=>{
            self.$message.success("编辑成功");
            self.getStationDesc();
        })
      }
    },
    /**修改招聘描述 */
    submitRecruitment(){
      let self = this;
       if(!self.station.recruitment.recruitmentDesc||self.station.recruitment.recruitmentDesc===''){
         self.$message.error("请输入招聘描述");
      }else{
        humanResourcesApi.updateRecruitmentDesc({
          id:self.orgId,
          recruitmentDesc:self.station.recruitment.recruitmentDesc
        }).then(res=>{
            self.$message.success("编辑成功");
            self.getRecruitmentDesc();
        })
      }
    },
    /**获取简历筛选列表 */
    getResumeScreeningList(){
      let self = this;
      humanResourcesApi.getResumeScreeningList(self.orgId).then(res=>{
        self.resumeScreening.list=res.content;
      })
    },
    /**显示简历筛选弹框 */
    showResumeScreeningDailog(type,row){
      let self= this;
      self.resumeScreening.dialog.isShow=true;
      self.resumeScreening.dialog.type = type;
      switch(type){
        case "insert":
           self.resumeScreening.dialog.title = "新增简历筛选"
          break;
        case "update":
          self.resumeScreening.dialog.title = "修改简历筛选";
          self.resumeScreening.dialog.formData =JSON.parse(JSON.stringify(row));
          break;
        case "imageUpload":
          self.resumeScreening.dialog.title = "图片列表";
          self.resumeScreening.dialog.formData =JSON.parse(JSON.stringify(row));
          self.getHrResumePictureUploadImageList();
          break;
        case "enclosureUpload":
          self.resumeScreening.dialog.title = "附件列表";
          self.resumeScreening.dialog.formData =JSON.parse(JSON.stringify(row));
          self.getHrResumeEnclosureUploadList();
          self.resumeScreening.enclosureUpload.data = {hrResumeAttachment:JSON.stringify({rid:self.resumeScreening.dialog.formData.id})}
          break;

      }
    },
    /**新增修改简历筛选*/
    submitResumeScreening(){
      let self= this;
      let postData = self.resumeScreening.dialog.type==='insert'?{
        hid:self.orgId,
        name:self.resumeScreening.dialog.formData.name,
        content:self.resumeScreening.dialog.formData.content
      }:JSON.parse(JSON.stringify(self.resumeScreening.dialog.formData))
      humanResourcesApi.insertUpdateResumeScreening(self.resumeScreening.dialog.type,postData).then(res=>{
        self.$message.success(`${self.resumeScreening.dialog.title}成功`);
        self.resumeScreening.dialog.isShow = false;
        self.getResumeScreeningList();
      })
    },
    /**简历筛选-获取图片上传列表*/
    getHrResumePictureUploadImageList(){
      let self = this;
      self.resumeScreening.previewList=[];
      humanResourcesApi.hrResumePictureUploadImageList(self.resumeScreening.dialog.formData.id).then(res=>{
        self.resumeScreening.imageUploadeList=res.content;
        if(res.content&&res.content.length>0){
          res.content.forEach(item=>{
            self.resumeScreening.previewList.push(item.path)
          })
        }
      })
    },
     /**简历筛选-获取附件上传列表*/
    getHrResumeEnclosureUploadList(){
      let self = this;
      humanResourcesApi.hrResumeEnclosureUploadList(self.resumeScreening.dialog.formData.id).then(res=>{
        self.resumeScreening.enclosureUpload.list = res.content
      })
    },
    /**图片上传成功 */
    uploadSuccess(response, file, fileList){
      let self = this;
      humanResourcesApi.insertUploadImage({
        rid:self.resumeScreening.dialog.formData.id,
        path:response.content
      }).then(res=>{
        self.$message.success("新增图片成功");
        self.$refs.uploadImage.clearFiles();
        self.getHrResumePictureUploadImageList();
      })
    },
     /**附件上传成功 */
    enclosureUploadSuccess(response, file, fileList){
      let self= this;
      if(response.statusCode==="200"){
        self.$message.success(`附件上传成功`);
        self.$refs.uploadEnclosure.clearFiles();
        self.getHrResumeEnclosureUploadList();
      }else{
         self.$message.error(`${response.desc}`);
      }
    },
    /**简历筛选-删除*/
    deleteFile(type,row){
      let self = this;
      let title = ""
      switch(type){
        case "img":
          title='图片';
          break;
        case "enclosure":
          title='附件';
          break;
      }
      self.$confirm(`是否删除此${title}？`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          center: true,
          type: 'warning',
      }).then(() => {
        switch(type){
        case "img":
          humanResourcesApi.deleteUploadImage(row.id).then(res=>{
          self.$message.success("删除成功");
          self.getHrResumePictureUploadImageList();
        })
          break;
        case "enclosure":
          humanResourcesApi.deleteEnclosure(row.id).then(res=>{
            self.$message.success("删除成功");
            self.getHrResumeEnclosureUploadList();
          })
          break;
      }
      }).catch(() => {});
    },
    /**简历筛选 - 下载 */
    downloadFile(type,row){
       let self = this;
        window.location.href = humanResourcesApi.downloadEnclosure(row.id);
    }
  }
}
</script>
<style   scoped>
.vueEditorBox{
max-width:1000px;
}

.previewImage{
max-height:200px;
}

</style>
